<%--
  Created by IntelliJ IDEA.
  User: 12965
  Date: 2023/7/13
  Time: 13:35
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page isELIgnored="false" %>
<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <title>login.JSP</title>
  <link href="./css/login.css" rel="stylesheet">
</head>

<body>
<div id="loginDiv">
  <form id="form" action="/project123/loginServlet" method="post">
    <h1 id="loginMsg">登 录</h1>
    <div id="errorMsg" style="text-align: center;color: red">${login_msg}</div>
    <p>Username:<input id="username" name="username" type="text" value="${cookie.username.value}"></p>

    <p>Password: <input id="password" name="password" type="password" value="${cookie.password.value}"></p>
    <p>记住我:<input id="remember" name="remember" value="1" type="checkbox" style="width: 20px;height: 20px;vertical-align: middle;margin-left: 5px;"></p>
    <div id="subDiv">
      <input type="submit" class="button" value="登录">
      <input type="reset" class="button" value="重置">&nbsp;
      <a  href="register.jsp" style="text-decoration: none pink">没有账号？点击注册</a>
    </div>
  </form>
</div>



</body>
<script src="js/axios-0.18.0.js"></script>
<script src="js/vue.js"></script>
<script src="element-ui/lib/index.js"></script>
<script>
  new Vue({
    el:"#app",
    data(){
      return{
        //错误信息
        login_msg:'',
        //登录信息

        user:{
          username:"",
          password:""
        }
      }
    },
    methods:{
      login(){
        var _this=this;
        axios({
          method:"post",
          url:"http://localhost:8080/project123/user/login",
          data:_this.user,
        }).then(function (resp){
          /*该this指的是window对象*/
          if(resp.data=='success'){
            //登陆成功
            window.location.href="/project123/brand.html";
          }
          else{
            _this.login_msg="登录失败，用户名或密码错误";

          }
        })
      },
    }




  })


</script>

</html>
